angular.module('App')
    .component('pagination-wrap', {
        templete: '<div  ng-if="!!pagination.scope.arr.length" class="pagination-wrap clearfix {{pagination.scope.classname}}"> \
                <span class="pull-right">{{pagination.scope.text}}</span> \
                <ul class="pull-right pagination"> \
                <li ng-repeat="item in pagination.scope.arr"><a ng-click="pagination.scope.clickFn(item)" ng-class="{disabled: item.disabled,active: item.active}">{{item.name}}</a></li>  \
        </div>',
        controller: function ($scope, $element) {
            var vm = this.scope;
            vm.arr = [];
            vm.callback = function (current, total, opt) {
                var current = +current,
                    total = +total,
                    arr = [];

                if (current < 1 || !current || !total) {
                    vm.text = '';
                    vm.arr = [];
                    return false;
                }

                var min = current - 3 < 1 ? 1 : current - 3,
                    max = current + 3 > total ? total : current + 3;

                current - 1 < 1 ? arr.push({ name: '首页', val: 1, disabled: !0 }, { name: '上一页', val: 1, disabled: !0 }) :
                    arr.push({ name: '首页', val: 1 }, { name: '上一页', val: current - 1 });
                for (var i = min; i <= max; i++) {
                    current === i ? arr.push({ val: i, name: i, active: !0 }) : arr.push({ val: i, name: i });
                }

                var len = arr.length;

                if (len < 8) {
                    for (var j = 0; j < 8 - len; j++) {
                        var prev = arr[0]['val'] - 1 < 1 ? 0 : arr[0]['val'] - 1,
                            next = arr[arr.length - 1]['val'] + 1 > total ? 0 : arr[arr.length - 1]['val'] + 1;

                        prev && arr.splice(1, 0, { name: prev, val: prev }) || next && arr.push({ name: next, val: next });
                    }
                }
                //  end of if

                current + 1 > total ? arr.push({ name: '下一页', val: total, disabled: !0 }, { name: '尾页', val: total, disabled: !0 }) :
                    arr.push({ name: '下一页', val: current + 1 }, { name: '尾页', val: total });
                opt ? vm.text = '当前页 ' + opt.current + ' 条 总共 ' + opt.total + '条' : '';
                vm.arr = arr;
            };
        },
        bindings: {
            scope: '<'
        },
        controllerAs: 'pagination'
    })
    .component('timeWrap', {
        template: '<input type="text" ng-if="!time.level" class="form-control" ng-model="time.scope.start" ng-click="time.scope.startCallback($event)" /> <span ng-if="level">至</span> \
        <input type="text" class="form-control" ng-click="time.scope.endCallback($event)" ng-model="time.scope.end" />',
        controller: function ($scope, $element, $filter) {
            var VIM = this.scope;

            VIM.init = function () {
                VIM.start ? '' : VIM.start = $filter('date')(Date.now() - (VIM.expires || 7) * 24 * 3600 * 1000, 'yyyy-MM-dd') + ' 00:00';
                VIM.end ? '' : VIM.end = $filter('date')(new Date(), 'yyyy-MM-dd') + ' 23:59';
            };
            VIM.init();

            layui.use('laydate', function () {
                var laydate = layui.laydate;
                var start = {
                    format: 'YYYY-MM-DD hh:mm',
                    istime: true,
                    max: VIM.end,
                    choose: function (datas) {
                        end.min = datas;
                        end.start = datas;

                        VIM.start = datas;
                    }
                },
                    end = {
                        format: 'YYYY-MM-DD hh:mm',
                        istime: true,
                        choose: function (datas) {
                            start.max = datas;

                            VIM.end = datas;
                        }
                    };
                VIM.startCallback = function (event) {
                    start.elem = event.target;
                    end.max = $filter('date')(new Date(), 'yyyy-MM-dd') + ' 23:59';
                    laydate(start);
                };

                VIM.endCallback = function (event) {
                    end.elem = event.target;
                    end.max = $filter('date')(new Date(), 'yyyy-MM-dd') + ' 23:59';
                    end.min = VIM.start;
                    laydate(end);
                };
            });
        },
        bindings: {
            scope: '<',
            level: '<'
        },
        controllerAs: 'time'
    })
    .component('selectModel', {
        template: ' <div class="select-model-box"> \
        <input type="text" class="form-control" ng-model="select.scope.val" ng-click="select.scope.off=1;select.scope.args={}" ng-blur="select.scope.blurFn()" placeholder="{{select.scope.placeholder}}" /> \
        <ul class="select-lists" ng-show="select.scope.off"> \
            <li ng-repeat="item in select.scope.lists | filter: select.scope.arg()"><a class="btn-link" ng-click="select.scope.clickFn(item)">{{item[select.scope.show]}}</a></li> \
        </ul> \
    </div>',
        controller: function ($scope, $element, Action) {
            var vm = this.scope;
            // {
            //     placeholder: '请选择配送公司',      //input placeholder
            //     val: '',                          //input  value
            //     show: 'f_brand',                  // 展示字段
            //     lists: [],                        //ul lists
            //     args: {}                          // 选择后保存对象
            // }
            vm.arg = function () {
                var obj = {};
                obj[vm.show] = vm.val
                return obj;
            };
            vm.clickFn = function (arg) {
                vm.off = 0;
                vm.val = arg[vm.show];
                vm.args = arg;
            };
            vm.blurFn = function () {
                if (!vm.val) {
                    vm.args = {};
                }
            };
            $element.mouseleave(function () {
                vm.off = 0;
            });
        },
        bindings: {
            scope: '=',
        },
        controllerAs: 'select'
    });